<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="../../assets/common/common.css" />
    <link rel="stylesheet" href="../../assets/iconfont/iconfont.css" />
    <link rel="stylesheet" href="./MittingRoom.css" />
  </head>
  <body>
    <div class="meetingRoom">
      <header class="top bg-fff flex aic pl-10 pr-10 jc-sb">
        <a href="../index/index.html">
          <span class="iconfont icon-xiangzuojiantou"></span>
        </a>
        <span>会议室预定</span>
        <span class="font f14">我的会议</span>
      </header>
      <!-- 选择时间 -->
      <div class="seleteTime rel bg-fff fdc f14">
        <div class="w100 flex jc-c aic mt-10">
          <div class="year">
            <span>&lt;</span>
            <span>2022年1月</span>
            <span>&gt;</span>
          </div>
        </div>
        <div class="week flex mt-10">
          <span class="weekday">日</span>
          <span class="weekday">一</span>
          <span class="weekday">二</span>
          <span class="weekday">三</span>
          <span class="weekday">四</span>
          <span class="weekday">五</span>
          <span class="weekday">六</span>
        </div>
        <div class="b">
          <div class="data flex mt-20"></div>
        </div>
      </div>
      <!-- 线条 -->
      <div class="button abs flex jc-c"></div>
      <!-- 会议室列表 -->
      <ul class="list w100 mt-20">
        <a href="./roomDetails/roomDetails.html">
          <li class="item mt-20 w100 bg-fff fdc pl-20 pr-20 pt-20">
            <div class="room flex">
              <img src="../../assets/img/u5391.png" alt="" />
              <div class="fdc jc-sa ml-10">
                <p>
                  <span>商务例会会议室</span>
                  <span class="text1">空闲</span>
                </p>
                <p class="font3">
                  <span class="iconfont text icon-duoren">
                    <span>100</span></span
                  >
                  <span class="iconfont text icon-dizhi">
                    <span>朝阳公园南路1号</span></span
                  >
                </p>
              </div>
            </div>
            <!-- 矩形分割线 -->
            <div class="box flex mt-10">
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
            </div>
            <div class="flex f12 mt-5 t-999">
              <span class="ml-35">10</span>
              <span class="num">12</span>
              <span class="num">14</span>
              <span class="num">16</span>
              <span class="num">18</span>
              <span class="num">20</span>
              <span class="num">22</span>
            </div>
          </li>
        </a>
        <a href="./roomDetails/roomDetails.html">
          <li class="item mt-20 w100 bg-fff fdc pl-20 pr-20 pt-20">
            <div class="room flex">
              <img src="../../assets/img/u5391.png" alt="" />
              <div class="fdc jc-sa ml-10">
                <p>
                  <span>商务例会会议室</span>
                  <span class="text1">空闲</span>
                </p>
                <p class="font3">
                  <span class="iconfont text icon-duoren">
                    <span>100</span></span
                  >
                  <span class="iconfont text icon-dizhi">
                    <span>朝阳公园南路1号</span></span
                  >
                </p>
              </div>
            </div>
            <!-- 矩形分割线 -->
            <div class="box flex mt-10">
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
            </div>
            <div class="flex f12 mt-5 t-999">
              <span class="ml-35">10</span>
              <span class="num">12</span>
              <span class="num">14</span>
              <span class="num">16</span>
              <span class="num">18</span>
              <span class="num">20</span>
              <span class="num">22</span>
            </div>
          </li>
        </a>
        <a href="./roomDetails/roomDetails.html">
          <li class="item mt-20 w100 bg-fff fdc pl-20 pr-20 pt-20">
            <div class="room flex">
              <img src="../../assets/img/u5391.png" alt="" />
              <div class="fdc jc-sa ml-10">
                <p>
                  <span>商务例会会议室</span>
                  <span class="text1">空闲</span>
                </p>
                <p class="font3">
                  <span class="iconfont text icon-duoren">
                    <span>100</span></span
                  >
                  <span class="iconfont text icon-dizhi">
                    <span>朝阳公园南路1号</span></span
                  >
                </p>
              </div>
            </div>
            <!-- 矩形分割线 -->
            <div class="box flex mt-10">
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
              <span class="rectangle1 ml-5"></span>
              <span class="rectangle2 ml-5"></span>
            </div>
            <div class="flex f12 mt-5 t-999">
              <span class="ml-35">10</span>
              <span class="num">12</span>
              <span class="num">14</span>
              <span class="num">16</span>
              <span class="num">18</span>
              <span class="num">20</span>
              <span class="num">22</span>
            </div>
          </li>
        </a>
      </ul>
      <!-- 没有更多了 -->
      <div class="text w100 tac mt-20 f14 t-999 mb-30">没有更多数据了~</div>
    </div>
  </body>

  <script>
    //日期选择
    function seleteTime() {
      var htmlStr = "";
      for (var i = 1; i <= 31; i++) {
        htmlStr += `
            <p class="days fcc fdc">
                    <span>${i}</span>
                    <img src="../../assets/img/u5433.png" alt="">
            </p>
            `;
      }
      document.querySelector(".data").innerHTML = htmlStr;
    }
    seleteTime();
  </script>
</html>
